<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>CSS生成内容</title>
    <style type="text/css">
        h1:after {
            /*利用:after伪类向h1最后面插入字符串*/
            content: "我是被插进来的";
            color: red;
        }

        h2:before {
            /*利用:before伪类向h2的最前边插入字符串*/
            content: "我是被插进来的";
            color: red;
        }

        h3:before {
            /*将h3的title属性的值获取到，再利用:before伪类插入到h2的最前边*/
            content: attr(title);
            color: red;
        }

        h4:after {
            /*生成一段网络上的图片url路径，再利用:after伪类插入到h2的最后边*/
            content: url("http://www.baijiqian.cn/uploads/allimg/150225/1G441D25_1.jpg");
            color: red;
        }
    </style>
</head>

<body>
    <h1>我是h1标题，在我前面插入内容吧</h1>
    <h2>我是h2标题，在我前面插入内容吧</h2>
    <h3 title="哈哈">我是h2标题，在我前面插入内容吧</h3>
    <h4>我是h2标题，在我前面插入内容吧</h4>
</body>

</html>